package br.com.ordersys.web.client.modules.uicomp;

import br.com.ordersys.web.client.modules.utils.UIUtils;

import com.google.gwt.dom.client.Element;
import com.google.gwt.event.dom.client.ClickEvent;
import com.google.gwt.event.dom.client.ClickHandler;
import com.google.gwt.user.client.ui.Button;
import com.google.gwt.user.client.ui.DialogBox;
import com.google.gwt.user.client.ui.Panel;
import com.google.gwt.user.client.ui.VerticalPanel;

public class BasicPopup extends DialogBox {
	private String title;
	private VerticalPanel body;

	public BasicPopup(boolean autohide, boolean modal) {
		this("&nbsp;", autohide, modal);
	}

	public BasicPopup(String title, boolean autohide, boolean modal) {
		super(autohide, modal);

		setStyleName("");// evita o style padrão do GWT (cheio de bordas e imagens)

		setTitle(title);

		applyStyles();

		setGlassEnabled(true);

		buildBodyPanel();

		addCloseButton();
	}

	private void buildBodyPanel() {
		body = new VerticalPanel();
		body.setSize("100%", "100%");

		setWidget(body);

		UIUtils.setParentStyle(body, "height: 100%");

		// O DecoratedPanel é montado em um layout de 3 x 3
		// aqui pegamos o TR responsável pela linha do meio, e ajustamos a altura para 100%
		Element middleCell = getCellElement(1, 0).getParentElement().getParentElement(); // getCellElement(1, 0) retorna o div (<tr><td><div>...</div></td></tr>)

		if (middleCell != null) {
			UIUtils.setStyle(middleCell.getStyle(), "height: 100%");
		}
	}

	private void changeTitle() {
		setHTML("<b><span style='padding: 5px; width: 100%; text-align: left; font-size: medium'>" + title + "</span></b>"); // cria um header vazio. O espaço em branco é necessário para o painel aparecer de fato
	}

	private void applyStyles() {
		// borda
		UIUtils.setWidgetStyle(this, "border: 1px solid; backgroundColor: white; borderRadius: 4px; padding: 4px");

		// header
		UIUtils.setWidgetStyle(getCaption().asWidget(), "cursor: move;"); // muda o cursor do header para melhorar a resposta visual para o usuário
	}

	public void setTitle(String title) {
		this.title = title == null || title.trim().length() == 0 ? "&nbsp;" : title;

		changeTitle();
	}
	
	public void setBodyPanel(Panel pnl){
		if(body.getWidgetCount() > 1){ //o botão de fechar é o filho 0 deste painel
			body.remove(1);
		}
		body.add(pnl);
	}
	
	private void addCloseButton(){
		Button b = new Button();
		b.setStyleName(""); //evita o default
		body.add(b);
		
		b.addClickHandler(new ClickHandler() {
			@Override
			public void onClick(ClickEvent e) {
				BasicPopup.this.hide();
			}
		});
		
		//por conta do header ser feito internamente por um Caption que intercepa os eventos, temos que posicionar o botão de fechar de maneira absoluta.
		//isso só funciona por que o próprio popup tem posicionamento absoluto
		UIUtils.setWidgetStyle(b, "position: absolute; right: 3px; top: 3px; width: 20px; height: 20px; border: 0px; backgroundColor: transparent; backgroundImage: url('images/close_dialog.png'); backgroundSize: 100% 100%; cursor: pointer");
	}

}
